ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಮತ್ತು ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್ಗಳಂತಹ ಸುಧಾರಿತ ಟೈಪ್ಸ್ಕ್ರಿಪ್ಟ್ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ಅನ್ವೇಷಿಸಿ, ಹೆಚ್ಚು ಅಭಿವ್ಯಕ್ತ ಮತ್ತು ನಿರ್ವಹಣೆಗೆ ಸುಲಭವಾದ ಕೋಡ್ ಬರೆಯಲು. ಸಂಕೀರ್ಣ ಸನ್ನಿವೇಶಗಳಿಗಾಗಿ ಟೈಪ್ ಮ್ಯಾನಿಪ್ಯುಲೇಶನ್ನಲ್ಲಿ ಪ್ರಾವೀಣ್ಯತೆ ಪಡೆಯಿರಿ.
ಟೈಪ್ಸ್ಕ್ರಿಪ್ಟ್ ಅಡ್ವಾನ್ಸ್ಡ್ ಟೈಪ್ಸ್: ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಮತ್ತು ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್ಗಳಲ್ಲಿ ಪರಿಣತಿ
ಟೈಪ್ಸ್ಕ್ರಿಪ್ಟ್ನ ಸಾಮರ್ಥ್ಯವು ಅದರ ಶಕ್ತಿಯುತ ಟೈಪ್ ಸಿಸ್ಟಮ್ನಲ್ಲಿದೆ. ಅನೇಕ ಸನ್ನಿವೇಶಗಳಿಗೆ string, number, ಮತ್ತು boolean ನಂತಹ ಮೂಲಭೂತ ಟೈಪ್ಗಳು ಸಾಕಾಗಿದ್ದರೂ, ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಟೈಪ್ಸ್ ಮತ್ತು ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್ಗಳಂತಹ ಅಡ್ವಾನ್ಸ್ಡ್ ಫೀಚರ್ಗಳು ಅಭಿವ್ಯಕ್ತಿ ಮತ್ತು ಟೈಪ್ ಸೇಫ್ಟಿಯ ಹೊಸ ಮಟ್ಟವನ್ನು ತೆರೆಯುತ್ತವೆ. ಈ ಮಾರ್ಗದರ್ಶಿ ಈ ಅಡ್ವಾನ್ಸ್ಡ್ ಟೈಪ್ಸ್ಗಳ ಸಮಗ್ರ ಅವಲೋಕನವನ್ನು ಒದಗಿಸುತ್ತದೆ, ಅವುಗಳ ಸಾಮರ್ಥ್ಯಗಳನ್ನು ಅನ್ವೇಷಿಸುತ್ತದೆ ಮತ್ತು ಪ್ರಾಯೋಗಿಕ ಅನ್ವಯಗಳನ್ನು ಪ್ರದರ್ಶಿಸುತ್ತದೆ.
ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಟೈಪ್ಸ್ಗಳನ್ನು ಅರ್ಥಮಾಡಿಕೊಳ್ಳುವುದು
ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಟೈಪ್ಸ್ಗಳು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ನ ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ಗಳ ಮೇಲೆ ನಿರ್ಮಿತವಾಗಿವೆ, ಸ್ಟ್ರಿಂಗ್ ಇಂಟರ್ಪೋಲೇಶನ್ ಆಧಾರದ ಮೇಲೆ ಟೈಪ್ಗಳನ್ನು ವ್ಯಾಖ್ಯಾನಿಸಲು ನಿಮಗೆ ಅವಕಾಶ ನೀಡುತ್ತವೆ. ಇದು ನಿರ್ದಿಷ್ಟ ಸ್ಟ್ರಿಂಗ್ ಪ್ಯಾಟರ್ನ್ಗಳನ್ನು ಪ್ರತಿನಿಧಿಸುವ ಟೈಪ್ಗಳ ರಚನೆಗೆ ಅನುವು ಮಾಡಿಕೊಡುತ್ತದೆ, ನಿಮ್ಮ ಕೋಡ್ ಅನ್ನು ಹೆಚ್ಚು ದೃಢ ಮತ್ತು ನಿರೀಕ್ಷಿತವಾಗಿಸುತ್ತದೆ.
ಮೂಲಭೂತ ಸಿಂಟ್ಯಾಕ್ಸ್ ಮತ್ತು ಬಳಕೆ
ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಟೈಪ್ಸ್ಗಳು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ಗಳಂತೆಯೇ ಟೈಪ್ ಡೆಫಿನಿಷನ್ ಅನ್ನು ಸುತ್ತುವರಿಯಲು ಬ್ಯಾಕ್ಟಿಕ್ಗಳನ್ನು (`) ಬಳಸುತ್ತವೆ. ಬ್ಯಾಕ್ಟಿಕ್ಗಳ ಒಳಗೆ, ನೀವು ${} ಸಿಂಟ್ಯಾಕ್ಸ್ ಬಳಸಿ ಇತರ ಟೈಪ್ಗಳನ್ನು ಇಂಟರ್ಪೋಲೇಟ್ ಮಾಡಬಹುದು. ಇಲ್ಲಿಯೇ ಮ್ಯಾಜಿಕ್ ನಡೆಯುವುದು - ನೀವು ಮೂಲಭೂತವಾಗಿ ಇಂಟರ್ಪೋಲೇಶನ್ನೊಳಗಿನ ಟೈಪ್ಗಳ ಆಧಾರದ ಮೇಲೆ ಕಂಪೈಲ್ ಸಮಯದಲ್ಲಿ ನಿರ್ಮಿಸಲಾದ ಸ್ಟ್ರಿಂಗ್ ಆಗಿರುವ ಟೈಪ್ ಅನ್ನು ರಚಿಸುತ್ತಿದ್ದೀರಿ.
type HTTPMethod = "GET" | "POST" | "PUT" | "DELETE";
type APIEndpoint = `/api/${string}`;
// Example Usage
const getEndpoint: APIEndpoint = "/api/users"; // Valid
const postEndpoint: APIEndpoint = "/api/products/123"; // Valid
const invalidEndpoint: APIEndpoint = "/admin/settings"; // TypeScript will not show an error here as `string` can be anything
ಈ ಉದಾಹರಣೆಯಲ್ಲಿ, APIEndpoint ಎಂಬುದು /api/ ನಿಂದ ಪ್ರಾರಂಭವಾಗುವ ಯಾವುದೇ ಸ್ಟ್ರಿಂಗ್ ಅನ್ನು ಪ್ರತಿನಿಧಿಸುವ ಒಂದು ಟೈಪ್ ಆಗಿದೆ. ಈ ಮೂಲಭೂತ ಉದಾಹರಣೆ ಉಪಯುಕ್ತವಾಗಿದ್ದರೂ, ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಟೈಪ್ಸ್ಗಳ ನಿಜವಾದ ಶಕ್ತಿಯು ಹೆಚ್ಚು ನಿರ್ದಿಷ್ಟವಾದ ಟೈಪ್ ಕನ್ಸ್ಟ್ರೈಂಟ್ಗಳೊಂದಿಗೆ ಸಂಯೋಜಿಸಿದಾಗ ಹೊರಹೊಮ್ಮುತ್ತದೆ.
ಯೂನಿಯನ್ ಟೈಪ್ಸ್ಗಳೊಂದಿಗೆ ಸಂಯೋಜಿಸುವುದು
ಯೂನಿಯನ್ ಟೈಪ್ಸ್ಗಳೊಂದಿಗೆ ಬಳಸಿದಾಗ ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಟೈಪ್ಸ್ಗಳು ನಿಜವಾಗಿಯೂ ಹೊಳೆಯುತ್ತವೆ. ಇದು ನಿರ್ದಿಷ್ಟ ಸ್ಟ್ರಿಂಗ್ ಸಂಯೋಜನೆಗಳ ಗುಂಪನ್ನು ಪ್ರತಿನಿಧಿಸುವ ಟೈಪ್ಗಳನ್ನು ರಚಿಸಲು ನಿಮಗೆ ಅನುವು ಮಾಡಿಕೊಡುತ್ತದೆ.
type HTTPMethod = "GET" | "POST" | "PUT" | "DELETE";
type APIPath = "users" | "products" | "orders";
type APIEndpoint = `/${APIPath}/${HTTPMethod}`;
// Valid API Endpoints
const getUsers: APIEndpoint = "/users/GET";
const postProducts: APIEndpoint = "/products/POST";
// Invalid API Endpoints (will result in TypeScript errors)
// const invalidEndpoint: APIEndpoint = "/users/PATCH"; // Error: "/users/PATCH" is not assignable to type "/users/GET" | "/users/POST" | "/users/PUT" | "/users/DELETE" | "/products/GET" | "/products/POST" | ... 3 more ... | "/orders/DELETE".
ಈಗ, APIEndpoint ಹೆಚ್ಚು ನಿರ್ಬಂಧಿತ ಟೈಪ್ ಆಗಿದ್ದು, ಇದು API ಪಾತ್ಗಳು ಮತ್ತು HTTP ಮೆಥಡ್ಗಳ ನಿರ್ದಿಷ್ಟ ಸಂಯೋಜನೆಗಳನ್ನು ಮಾತ್ರ ಅನುಮತಿಸುತ್ತದೆ. ಟೈಪ್ಸ್ಕ್ರಿಪ್ಟ್ ಅಮಾನ್ಯ ಸಂಯೋಜನೆಗಳನ್ನು ಬಳಸುವ ಯಾವುದೇ ಪ್ರಯತ್ನಗಳನ್ನು ಫ್ಲ್ಯಾಗ್ ಮಾಡುತ್ತದೆ, ಇದರಿಂದ ಟೈಪ್ ಸೇಫ್ಟಿ ಹೆಚ್ಚಾಗುತ್ತದೆ.
ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಟೈಪ್ಸ್ಗಳೊಂದಿಗೆ ಸ್ಟ್ರಿಂಗ್ ಮ್ಯಾನಿಪ್ಯುಲೇಶನ್
ಟೈಪ್ಸ್ಕ್ರಿಪ್ಟ್ ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಟೈಪ್ಸ್ಗಳೊಂದಿಗೆ ಸರಾಗವಾಗಿ ಕಾರ್ಯನಿರ್ವಹಿಸುವ ಇಂಟ್ರಿನ್ಸಿಕ್ ಸ್ಟ್ರಿಂಗ್ ಮ್ಯಾನಿಪ್ಯುಲೇಶನ್ ಟೈಪ್ಸ್ಗಳನ್ನು ಒದಗಿಸುತ್ತದೆ. ಈ ಟೈಪ್ಸ್ಗಳು ಕಂಪೈಲ್ ಸಮಯದಲ್ಲಿ ಸ್ಟ್ರಿಂಗ್ಗಳನ್ನು ಪರಿವರ್ತಿಸಲು ನಿಮಗೆ ಅವಕಾಶ ನೀಡುತ್ತವೆ.
- Uppercase: ಒಂದು ಸ್ಟ್ರಿಂಗ್ ಅನ್ನು ದೊಡ್ಡಕ್ಷರಕ್ಕೆ ಪರಿವರ್ತಿಸುತ್ತದೆ.
- Lowercase: ಒಂದು ಸ್ಟ್ರಿಂಗ್ ಅನ್ನು ಸಣ್ಣಕ್ಷರಕ್ಕೆ ಪರಿವರ್ತಿಸುತ್ತದೆ.
- Capitalize: ಸ್ಟ್ರಿಂಗ್ನ ಮೊದಲ ಅಕ್ಷರವನ್ನು ಕ್ಯಾಪಿಟಲೈಸ್ ಮಾಡುತ್ತದೆ.
- Uncapitalize: ಸ್ಟ್ರಿಂಗ್ನ ಮೊದಲ ಅಕ್ಷರವನ್ನು ಅನ್ಕ್ಯಾಪಿಟಲೈಸ್ ಮಾಡುತ್ತದೆ.
type Greeting = "hello world";
type UppercaseGreeting = Uppercase; // "HELLO WORLD"
type LowercaseGreeting = Lowercase; // "hello world"
type CapitalizedGreeting = Capitalize; // "Hello world"
type UncapitalizedGreeting = Uncapitalize; // "hello world"
ಈ ಸ್ಟ್ರಿಂಗ್ ಮ್ಯಾನಿಪ್ಯುಲೇಶನ್ ಟೈಪ್ಸ್ಗಳು ನೇಮಿಂಗ್ ಕನ್ವೆನ್ಷನ್ಗಳ ಆಧಾರದ ಮೇಲೆ ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಟೈಪ್ಸ್ಗಳನ್ನು ರಚಿಸಲು ವಿಶೇಷವಾಗಿ ಉಪಯುಕ್ತವಾಗಿವೆ. ಉದಾಹರಣೆಗೆ, ನೀವು ಈವೆಂಟ್ ಹೆಸರುಗಳಿಂದ ಆಕ್ಷನ್ ಟೈಪ್ಸ್ಗಳನ್ನು ಅಥವಾ ಪ್ರತಿಯಾಗಿ ಪಡೆಯಬಹುದು.
ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಟೈಪ್ಸ್ಗಳ ಪ್ರಾಯೋಗಿಕ ಅನ್ವಯಗಳು
- API Endpoint Definition: ಮೇಲೆ ಪ್ರದರ್ಶಿಸಿದಂತೆ, ನಿಖರವಾದ ಟೈಪ್ ಕನ್ಸ್ಟ್ರೈಂಟ್ಗಳೊಂದಿಗೆ API ಎಂಡ್ಪಾಯಿಂಟ್ಗಳನ್ನು ವ್ಯಾಖ್ಯಾನಿಸುವುದು.
- Event Handling: ನಿರ್ದಿಷ್ಟ ಪ್ರಿಫಿಕ್ಸ್ಗಳು ಮತ್ತು ಸಫಿಕ್ಸ್ಗಳೊಂದಿಗೆ ಈವೆಂಟ್ ಹೆಸರುಗಳಿಗಾಗಿ ಟೈಪ್ಸ್ಗಳನ್ನು ರಚಿಸುವುದು.
- CSS Class Generation: ಕಾಂಪೊನೆಂಟ್ ಹೆಸರುಗಳು ಮತ್ತು ಸ್ಟೇಟ್ಗಳ ಆಧಾರದ ಮೇಲೆ CSS ಕ್ಲಾಸ್ ಹೆಸರುಗಳನ್ನು ರಚಿಸುವುದು.
- Database Query Building: ಡೇಟಾಬೇಸ್ ಕ್ವೆರಿಗಳನ್ನು ನಿರ್ಮಿಸುವಾಗ ಟೈಪ್ ಸೇಫ್ಟಿಯನ್ನು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳುವುದು.
ಅಂತರರಾಷ್ಟ್ರೀಯ ಉದಾಹರಣೆ: ಕರೆನ್ಸಿ ಫಾರ್ಮ್ಯಾಟಿಂಗ್
ಬಹು ಕರೆನ್ಸಿಗಳನ್ನು ಬೆಂಬಲಿಸುವ ಹಣಕಾಸು ಅಪ್ಲಿಕೇಶನ್ ಅನ್ನು ನಿರ್ಮಿಸುವುದನ್ನು ಕಲ್ಪಿಸಿಕೊಳ್ಳಿ. ಸರಿಯಾದ ಕರೆನ್ಸಿ ಫಾರ್ಮ್ಯಾಟಿಂಗ್ ಅನ್ನು ಜಾರಿಗೊಳಿಸಲು ನೀವು ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಟೈಪ್ಸ್ಗಳನ್ನು ಬಳಸಬಹುದು.
type CurrencyCode = "USD" | "EUR" | "GBP" | "JPY";
type CurrencyFormat = `${number} ${T}`;
const priceUSD: CurrencyFormat<"USD"> = "100 USD"; // Valid
const priceEUR: CurrencyFormat<"EUR"> = "50 EUR"; // Valid
// const priceInvalid: CurrencyFormat<"USD"> = "100 EUR"; // Error: Type 'string' is not assignable to type '`${number} USD`'.
function formatCurrency(amount: number, currency: T): CurrencyFormat {
return `${amount} ${currency}`;
}
const formattedUSD = formatCurrency(250, "USD"); // Type: "250 USD"
const formattedEUR = formatCurrency(100, "EUR"); // Type: "100 EUR"
ಈ ಉದಾಹರಣೆಯು ಕರೆನ್ಸಿ ಮೌಲ್ಯಗಳು ಯಾವಾಗಲೂ ಸರಿಯಾದ ಕರೆನ್ಸಿ ಕೋಡ್ನೊಂದಿಗೆ ಫಾರ್ಮ್ಯಾಟ್ ಆಗಿರುವುದನ್ನು ಖಚಿತಪಡಿಸುತ್ತದೆ, ಸಂಭಾವ್ಯ ದೋಷಗಳನ್ನು ತಡೆಯುತ್ತದೆ.
ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್ಗಳ ಆಳಕ್ಕೆ ಇಳಿಯುವುದು
ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್ಗಳು ಟೈಪ್ಸ್ಕ್ರಿಪ್ಟ್ನ ಟೈಪ್ ಸಿಸ್ಟಮ್ಗೆ ಬ್ರಾಂಚಿಂಗ್ ಲಾಜಿಕ್ ಅನ್ನು ಪರಿಚಯಿಸುತ್ತವೆ, ಇತರ ಟೈಪ್ಸ್ಗಳ ಮೇಲೆ ಅವಲಂಬಿತವಾಗಿರುವ ಟೈಪ್ಸ್ಗಳನ್ನು ವ್ಯಾಖ್ಯಾನಿಸಲು ನಿಮಗೆ ಅನುವು ಮಾಡಿಕೊಡುತ್ತದೆ. ಈ ವೈಶಿಷ್ಟ್ಯವು ಹೆಚ್ಚು ಹೊಂದಿಕೊಳ್ಳುವ ಮತ್ತು ಮರುಬಳಕೆ ಮಾಡಬಹುದಾದ ಟೈಪ್ ಡೆಫಿನಿಷನ್ಗಳನ್ನು ರಚಿಸಲು ನಂಬಲಾಗದಷ್ಟು ಶಕ್ತಿಯುತವಾಗಿದೆ.
ಮೂಲಭೂತ ಸಿಂಟ್ಯಾಕ್ಸ್ ಮತ್ತು ಬಳಕೆ
ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್ಗಳು ಟೈಪ್ ಕಂಡೀಷನ್ಗಳನ್ನು ವ್ಯಾಖ್ಯಾನಿಸಲು infer ಕೀವರ್ಡ್ ಮತ್ತು ಟರ್ನರಿ ಆಪರೇಟರ್ (condition ? trueType : falseType) ಅನ್ನು ಬಳಸುತ್ತವೆ.
type IsString = T extends string ? true : false;
type StringCheck = IsString; // type StringCheck = true
type NumberCheck = IsString; // type NumberCheck = false
ಈ ಉದಾಹರಣೆಯಲ್ಲಿ, IsString ಒಂದು ಕಂಡೀಷನಲ್ ಟೈಪ್ ಆಗಿದ್ದು, ಇದು T string ಗೆ ಅಸೈನ್ ಮಾಡಬಹುದೇ ಎಂದು ಪರಿಶೀಲಿಸುತ್ತದೆ. ಹಾಗಿದ್ದರೆ, ಟೈಪ್ true ಗೆ ರಿಸಾಲ್ವ್ ಆಗುತ್ತದೆ; ಇಲ್ಲದಿದ್ದರೆ, ಅದು false ಗೆ ರಿಸಾಲ್ವ್ ಆಗುತ್ತದೆ.
infer ಕೀವರ್ಡ್
infer ಕೀವರ್ಡ್ ಒಂದು ಟೈಪ್ನಿಂದ ಇನ್ನೊಂದು ಟೈಪ್ ಅನ್ನು ಹೊರತೆಗೆಯಲು ನಿಮಗೆ ಅನುಮತಿಸುತ್ತದೆ. ಫಂಕ್ಷನ್ ಟೈಪ್ಸ್ ಅಥವಾ ಅರೇ ಟೈಪ್ಸ್ನಂತಹ ಸಂಕೀರ್ಣ ಟೈಪ್ಸ್ಗಳೊಂದಿಗೆ ಕೆಲಸ ಮಾಡುವಾಗ ಇದು ವಿಶೇಷವಾಗಿ ಉಪಯುಕ್ತವಾಗಿದೆ.
type ReturnType any> = T extends (...args: any) => infer R ? R : any;
function add(a: number, b: number): number {
return a + b;
}
type AddReturnType = ReturnType; // type AddReturnType = number
ಈ ಉದಾಹರಣೆಯಲ್ಲಿ, ReturnType ಒಂದು ಫಂಕ್ಷನ್ ಟೈಪ್ T ನ ರಿಟರ್ನ್ ಟೈಪ್ ಅನ್ನು ಹೊರತೆಗೆಯುತ್ತದೆ. ಕಂಡೀಷನಲ್ ಟೈಪ್ನ infer R ಭಾಗವು ರಿಟರ್ನ್ ಟೈಪ್ ಅನ್ನು ಇನ್ಫರ್ ಮಾಡುತ್ತದೆ ಮತ್ತು ಅದನ್ನು ಟೈಪ್ ವೇರಿಯಬಲ್ R ಗೆ ನಿಯೋಜಿಸುತ್ತದೆ. T ಫಂಕ್ಷನ್ ಟೈಪ್ ಆಗದಿದ್ದರೆ, ಟೈಪ್ any ಗೆ ರಿಸಾಲ್ವ್ ಆಗುತ್ತದೆ.
ಡಿಸ್ಟ್ರಿಬ್ಯೂಟಿವ್ ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್
ಪರಿಶೀಲಿಸಿದ ಟೈಪ್ ನೇಕ್ಡ್ ಟೈಪ್ ಪ್ಯಾರಾಮೀಟರ್ ಆಗಿರುವಾಗ ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್ಗಳು ಡಿಸ್ಟ್ರಿಬ್ಯೂಟಿವ್ ಆಗುತ್ತವೆ. ಇದರರ್ಥ ಕಂಡೀಷನಲ್ ಟೈಪ್ ಅನ್ನು ಯೂನಿಯನ್ ಟೈಪ್ನ ಪ್ರತಿಯೊಬ್ಬ ಸದಸ್ಯನಿಗೆ ಪ್ರತ್ಯೇಕವಾಗಿ ಅನ್ವಯಿಸಲಾಗುತ್ತದೆ.
type ToArray = T extends any ? T[] : never;
type NumberOrStringArray = ToArray; // type NumberOrStringArray = string[] | number[]
ಈ ಉದಾಹರಣೆಯಲ್ಲಿ, ToArray ಒಂದು ಟೈಪ್ T ಅನ್ನು ಅರೇ ಟೈಪ್ಗೆ ಪರಿವರ್ತಿಸುತ್ತದೆ. ಏಕೆಂದರೆ T ಒಂದು ನೇಕ್ಡ್ ಟೈಪ್ ಪ್ಯಾರಾಮೀಟರ್ (ಬೇರೆ ಟೈಪ್ನಲ್ಲಿ ಸುತ್ತಿಲ್ಲ), ಕಂಡೀಷನಲ್ ಟೈಪ್ ಅನ್ನು number ಮತ್ತು string ಗೆ ಪ್ರತ್ಯೇಕವಾಗಿ ಅನ್ವಯಿಸಲಾಗುತ್ತದೆ, ಇದರ ಪರಿಣಾಮವಾಗಿ number[] ಮತ್ತು string[] ಗಳ ಯೂನಿಯನ್ ಉಂಟಾಗುತ್ತದೆ.
ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್ಗಳ ಪ್ರಾಯೋಗಿಕ ಅನ್ವಯಗಳು
- Extracting Return Types: ಮೇಲೆ ಪ್ರದರ್ಶಿಸಿದಂತೆ, ಫಂಕ್ಷನ್ನ ರಿಟರ್ನ್ ಟೈಪ್ ಅನ್ನು ಹೊರತೆಗೆಯುವುದು.
- Filtering Types from a Union: ಯೂನಿಯನ್ನಿಂದ ನಿರ್ದಿಷ್ಟ ಟೈಪ್ಸ್ಗಳನ್ನು ಮಾತ್ರ ಒಳಗೊಂಡಿರುವ ಟೈಪ್ ಅನ್ನು ರಚಿಸುವುದು.
- Defining Overloaded Function Types: ಇನ್ಪುಟ್ ಟೈಪ್ಸ್ಗಳ ಆಧಾರದ ಮೇಲೆ ವಿಭಿನ್ನ ಫಂಕ್ಷನ್ ಟೈಪ್ಸ್ಗಳನ್ನು ರಚಿಸುವುದು.
- Creating Type Guards: ವೇರಿಯಬಲ್ನ ಟೈಪ್ ಅನ್ನು ಸಂಕುಚಿತಗೊಳಿಸುವ ಫಂಕ್ಷನ್ಗಳನ್ನು ವ್ಯಾಖ್ಯಾನಿಸುವುದು.
ಅಂತರರಾಷ್ಟ್ರೀಯ ಉದಾಹರಣೆ: ವಿಭಿನ್ನ ದಿನಾಂಕ ಫಾರ್ಮ್ಯಾಟ್ಗಳನ್ನು ನಿರ್ವಹಿಸುವುದು
ಪ್ರಪಂಚದ ವಿವಿಧ ಪ್ರದೇಶಗಳು ವಿಭಿನ್ನ ದಿನಾಂಕ ಫಾರ್ಮ್ಯಾಟ್ಗಳನ್ನು ಬಳಸುತ್ತವೆ. ಈ ವ್ಯತ್ಯಾಸಗಳನ್ನು ನಿರ್ವಹಿಸಲು ನೀವು ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್ಗಳನ್ನು ಬಳಸಬಹುದು.
type DateFormat = "YYYY-MM-DD" | "MM/DD/YYYY" | "DD.MM.YYYY";
type ParseDate = T extends "YYYY-MM-DD"
? { year: number; month: number; day: number; format: "YYYY-MM-DD" }
: T extends "MM/DD/YYYY"
? { month: number; day: number; year: number; format: "MM/DD/YYYY" }
: T extends "DD.MM.YYYY"
? { day: number; month: number; year: number; format: "DD.MM.YYYY" }
: never;
function parseDate(dateString: string, format: T): ParseDate {
// (Implementation would handle different date formats)
if (format === "YYYY-MM-DD") {
const [year, month, day] = dateString.split("-").map(Number);
return { year, month, day, format } as ParseDate;
} else if (format === "MM/DD/YYYY") {
const [month, day, year] = dateString.split("/").map(Number);
return { month, day, year, format } as ParseDate;
} else if (format === "DD.MM.YYYY") {
const [day, month, year] = dateString.split(".").map(Number);
return { day, month, year, format } as ParseDate;
} else {
throw new Error("Invalid date format");
}
}
const parsedDateISO = parseDate("2023-10-27", "YYYY-MM-DD"); // Type: { year: number; month: number; day: number; format: "YYYY-MM-DD"; }
const parsedDateUS = parseDate("10/27/2023", "MM/DD/YYYY"); // Type: { month: number; day: number; year: number; format: "MM/DD/YYYY"; }
const parsedDateEU = parseDate("27.10.2023", "DD.MM.YYYY"); // Type: { day: number; month: number; year: number; format: "DD.MM.YYYY"; }
console.log(parsedDateISO.year); // Access the year knowing it will be there
ಈ ಉದಾಹರಣೆಯು ನಿರ್ದಿಷ್ಟಪಡಿಸಿದ ದಿನಾಂಕ ಫಾರ್ಮ್ಯಾಟ್ನ ಆಧಾರದ ಮೇಲೆ ವಿಭಿನ್ನ ದಿನಾಂಕ ಪಾರ್ಸಿಂಗ್ ಫಂಕ್ಷನ್ಗಳನ್ನು ವ್ಯಾಖ್ಯಾನಿಸಲು ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್ಗಳನ್ನು ಬಳಸುತ್ತದೆ. ParseDate ಟೈಪ್, ಹಿಂತಿರುಗಿಸಿದ ಆಬ್ಜೆಕ್ಟ್ ಫಾರ್ಮ್ಯಾಟ್ಗೆ ಅನುಗುಣವಾಗಿ ಸರಿಯಾದ ಪ್ರಾಪರ್ಟಿಗಳನ್ನು ಹೊಂದಿದೆ ಎಂದು ಖಚಿತಪಡಿಸುತ್ತದೆ.
ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಮತ್ತು ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್ಗಳನ್ನು ಸಂಯೋಜಿಸುವುದು
ನೀವು ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಟೈಪ್ಸ್ ಮತ್ತು ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್ಗಳನ್ನು ಸಂಯೋಜಿಸಿದಾಗ ನಿಜವಾದ ಶಕ್ತಿ ಬರುತ್ತದೆ. ಇದು ನಂಬಲಾಗದಷ್ಟು ಶಕ್ತಿಯುತವಾದ ಟೈಪ್ ಮ್ಯಾನಿಪ್ಯುಲೇಶನ್ಗಳಿಗೆ ಅನುವು ಮಾಡಿಕೊಡುತ್ತದೆ.
type EventName = `on${Capitalize}`;
type ExtractEventPayload = T extends EventName
? { type: T; payload: any } // Simplified for demonstration
: never;
type ClickEvent = EventName<"click">; // "onClick"
type MouseOverEvent = EventName<"mouseOver">; // "onMouseOver"
//Example function that takes a type
function processEvent(event: T): ExtractEventPayload {
//In a real implementation, we would actually dispatch the event.
console.log(`Processing event ${event}`);
//In a real implementation, the payload would be based on event type.
return { type: event, payload: {} } as ExtractEventPayload;
}
//Note that the return types are very specific:
const clickEvent = processEvent("onClick"); // { type: "onClick"; payload: any; }
const mouseOverEvent = processEvent("onMouseOver"); // { type: "onMouseOver"; payload: any; }
//If you use other strings, you get never:
// const someOtherEvent = processEvent("someOtherEvent"); // Type is `never`
ಉತ್ತಮ ಅಭ್ಯಾಸಗಳು ಮತ್ತು ಪರಿಗಣನೆಗಳು
- Keep it Simple: ಶಕ್ತಿಯುತವಾಗಿದ್ದರೂ, ಈ ಅಡ್ವಾನ್ಸ್ಡ್ ಟೈಪ್ಸ್ಗಳು ಬೇಗನೆ ಸಂಕೀರ್ಣವಾಗಬಹುದು. ಸ್ಪಷ್ಟತೆ ಮತ್ತು ನಿರ್ವಹಣೆಗಾಗಿ ಶ್ರಮಿಸಿ.
- Test Thoroughly: ನಿಮ್ಮ ಟೈಪ್ ಡೆಫಿನಿಷನ್ಗಳು ನಿರೀಕ್ಷೆಯಂತೆ ವರ್ತಿಸುತ್ತವೆಯೇ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ಸಮಗ್ರ ಯೂನಿಟ್ ಟೆಸ್ಟ್ಗಳನ್ನು ಬರೆಯಿರಿ.
- Document Your Code: ಕೋಡ್ ಓದುವಿಕೆಯನ್ನು ಸುಧಾರಿಸಲು ನಿಮ್ಮ ಅಡ್ವಾನ್ಸ್ಡ್ ಟೈಪ್ಸ್ಗಳ ಉದ್ದೇಶ ಮತ್ತು ನಡವಳಿಕೆಯನ್ನು ಸ್ಪಷ್ಟವಾಗಿ ದಾಖಲಿಸಿ.
- Consider Performance: ಅಡ್ವಾನ್ಸ್ಡ್ ಟೈಪ್ಸ್ಗಳ ಅತಿಯಾದ ಬಳಕೆಯು ಕಂಪೈಲೇಶನ್ ಸಮಯದ ಮೇಲೆ ಪರಿಣಾಮ ಬೀರಬಹುದು. ನಿಮ್ಮ ಕೋಡ್ ಅನ್ನು ಪ್ರೊಫೈಲ್ ಮಾಡಿ ಮತ್ತು ಅಗತ್ಯವಿರುವಲ್ಲಿ ಆಪ್ಟಿಮೈಜ್ ಮಾಡಿ.
ತೀರ್ಮಾನ
ಟೆಂಪ್ಲೇಟ್ ಲಿಟರಲ್ ಟೈಪ್ಸ್ ಮತ್ತು ಕಂಡೀಷನಲ್ ಟೈಪ್ಸ್ಗಳು ಟೈಪ್ಸ್ಕ್ರಿಪ್ಟ್ನ ಬತ್ತಳಿಕೆಯಲ್ಲಿರುವ ಶಕ್ತಿಶಾಲಿ ಸಾಧನಗಳಾಗಿವೆ. ಈ ಅಡ್ವಾನ್ಸ್ಡ್ ಟೈಪ್ಸ್ಗಳಲ್ಲಿ ಪರಿಣತಿ ಹೊಂದುವುದರಿಂದ, ನೀವು ಹೆಚ್ಚು ಅಭಿವ್ಯಕ್ತ, ನಿರ್ವಹಣೆಗೆ ಸುಲಭ ಮತ್ತು ಟೈಪ್-ಸೇಫ್ ಕೋಡ್ ಬರೆಯಬಹುದು. ಈ ವೈಶಿಷ್ಟ್ಯಗಳು ಟೈಪ್ಸ್ಗಳ ನಡುವಿನ ಸಂಕೀರ್ಣ ಸಂಬಂಧಗಳನ್ನು ಸೆರೆಹಿಡಿಯಲು, ಕಠಿಣ ನಿರ್ಬಂಧಗಳನ್ನು ಜಾರಿಗೊಳಿಸಲು ಮತ್ತು ಹೆಚ್ಚು ಮರುಬಳಕೆ ಮಾಡಬಹುದಾದ ಟೈಪ್ ಡೆಫಿನಿಷನ್ಗಳನ್ನು ರಚಿಸಲು ನಿಮಗೆ ಅನುವು ಮಾಡಿಕೊಡುತ್ತವೆ. ನಿಮ್ಮ ಟೈಪ್ಸ್ಕ್ರಿಪ್ಟ್ ಕೌಶಲ್ಯಗಳನ್ನು ಉನ್ನತೀಕರಿಸಲು ಮತ್ತು ಜಾಗತಿಕ ಪ್ರೇಕ್ಷಕರಿಗಾಗಿ ದೃಢವಾದ ಮತ್ತು ಸ್ಕೇಲೆಬಲ್ ಅಪ್ಲಿಕೇಶನ್ಗಳನ್ನು ನಿರ್ಮಿಸಲು ಈ ತಂತ್ರಗಳನ್ನು ಅಳವಡಿಸಿಕೊಳ್ಳಿ.